import type { DrawerProps } from 'antd';
import { Drawer } from 'antd';
import React from 'react';

const CusDrawer: React.FC<DrawerProps> = (props) => {
  // width,bodyStyle,push:多层抽屉的推动行为
  const { open, children, ...restProps } = props;
  // drawer div层级关系： ym_drawer_root[rootClassName、rootStyle] > content-wrapper > content[className、style] > wrapper-body > body[bodyStyle]

  const drawerConfig = {
    open,
    title: '详情',
    // placement: 'right',
    height: '100%',
    // size: 'large', //预设抽屉宽度（或高度）
    rootClassName: 'ym_drawer_root', //rootDiv(遮罩+弹层)类名
    // rootStyle, // rootDiv(遮罩+弹层) 样式
    className: 'ym_drawer_content', // content[body+footer]内容最外层容器类名
    // style, // content[body+footer] 容器样式
    bodyStyle: { background: '#eff2f5', padding: '12px' }, //body样式
    // destroyOnClose: true,
  };

  return (
    <Drawer {...drawerConfig} {...restProps} destroyOnClose={true}>
      {children}
    </Drawer>
  );
};

export default CusDrawer;
